<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" name="viewport" />
		<meta content="yes" name="apple-mobile-web-app-capable" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style" />
		<meta content="telephone=no" name="format-detection" />
		<title>积分商城列表</title>
		<!-- 引入YDUI样式 -->
		<link rel="stylesheet" href="{:_SKIN}/weixin/jifen/ydui/demo/css/ydui.css" />
		<!-- 引入YDUI自适应解决方案类库 -->
		<script src="{:_SKIN}/weixin/jifen/ydui/build/js/ydui.flexible.js"></script>
		<style type="text/css">
			.m-navbar{background-color: #15ce67;}
			.navbar-item .back-ico:before{color: #FFFFFF;}
			.icon-home-outline:before{color: #FFFFFF;font-size: 0.36rem;}
			.sousuo{height: 30px;padding: 5px 10px;}
			.sousuo_1{width: 100%;}
			.sou{width: 100%;border: 0;background-color: #FFFFFF;height: 24px;border-radius: 4px;padding-left: 40px;background-image: url({:_SKIN}/weixin/jifen/picture/shop-sousuo.png);background-repeat: no-repeat;background-position: left;background-size: 16px 16px;background-position-x: 14px;color: #666666;}
			::-webkit-input-placeholder{color:#666;}
			.pro-sort{text-align:center;background:#f5f5f5;border-bottom:1px solid #efeff4}
			.weui-flex{display:-webkit-box;display:-webkit-flex;display:flex}
			.weui-flex__item{-webkit-box-flex:1;-webkit-flex:1;flex:1}
			.pro-sort .weui-flex__item .placeholder{height:40px;line-height:40px;position:relative;font-size:14px}
			.pro-sort .weui-flex__item .placeholder:before{content:"";height:20px;width:1px;background:#dedede;position:absolute;left:0;top:10px}
			.pro-sort .weui-flex__item .placeholder.SortDescCss:after{content:"";border:4px solid transparent;border-bottom:4px solid #000;font-size:0;line-height:0;width:0;height:0;position:absolute;right:15px;top:14px}
			.pro-sort .weui-flex__item .placeholder.SortAscCss:after{content:"";border:4px solid transparent;border-top:4px solid #000;font-size:0;line-height:0;width:0;height:0;position:absolute;right:15px;top:18px}

		</style>
	</head>

	<body>
		<section class="g-flexview">

			<header class="m-navbar">
				<a href="#" class="navbar-item"><i class="back-ico"></i></a>
				<div class="navbar-center"><span class="navbar-title" style="color: #FFFFFF;">积分商城</span></div>
				<a href="#" class="navbar-item"><i class="icon-home-outline"></i></a>
			</header>
			<!-- <div class="sousuo">
				<form class="sousuo_1">
					<div class="sousuo_1_1">
						<input type="search" class="sou" id="serch" placeholder="请输入关键词">
					</div>

				</form>
			</div> -->
			<!-- <div class="pro-sort">
				<div class="weui-flex">
					<div class="weui-flex__item">
						<div class="placeholder SortAscCss">上架时间</div>
					</div>
					<div class="weui-flex__item">
						<div class="placeholder SortAscCss">积分价值</div>
					</div>
					<div class="weui-flex__item">
						<div class="placeholder SortDescCss">商品销量</div>
					</div>
				</div>
			</div> -->
			<section class="g-scrollview">
               {empty name="list"}

               本目录下暂无产品
               {/empty}
				<article class="m-list list-theme2">
             
               {volist name="list" id="v"}
					<a href="{:url('details',['id'=>$v['id']])}" class="list-item">
						<div class="list-img">
							<img class="lazy" data-url="{$v.pic}">
						</div>
						<div class="list-mes">
							<h3 class="list-title">{$v.name}</h3>
							<div class="list-mes-item">
								<div>
									<span class="list-price">{$v.price}</span>

									<span class="list-del-price">¥{$v.price+16.38}</span>
								</div>
								<div>人气：{$v.click}</div>
							</div>
						</div>
					</a>
             {/volist}
					
				</article>

			</section>

		</section>

		<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
		<script src="{:_SKIN}/weixin/jifen/ydui/build/js/ydui.js" type="text/javascript"></script>
		<script>
		 $('img.lazy').lazyLoad();
			! function() {
				$('.m-list').find('img').lazyLoad({
					binder: '.g-scrollview'
				});
			}();
		</script>
	</body>

</html>